<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        // 变量声明： var let
        // 常量 ： 不变得值 ，一旦声明就不会改变  
        // Math.PI
        // const NAME = "张三";
        // const ele = document.querySelector(".box");
        // 常量 使用：
        // 1.不能重复声明 
        // const NAME = '李四';
        // 2.不能改变
        // NAME = "李四";
        // 3.没有申明前置 （没有预解析）;
        // const NAME = "张三";
        // console.log(NAME);
        // 4.支持块作用域
        // {
        //     const name = "张三";
        //     console.log(name);
        // }
        // 5.也不会挂载window 
            // const myname = "张三";
            // console.log(window.myname);


        // 强调一点： 是定义对象的时候  
        // const obj = {
        //     name:"张三",
        //     age:20
        // }
        

        // // obj = {
        // //     name:"李四"
        // // }
        // obj.name = "李四";
        // console.log(obj);

        // 我们需要不能更改的对象； Object.freeze 让对象不能更改
        // Object.freeze:只能让一层对象不能被修改  ；
        const obj = {
            name:"张三",
            age:20,
            obj1:{
                hobbby:"篮球",
                obj2:{
                    name:"王五"
                }
            }
        }
        // 如何深冻结 ？？
        // Object.freeze(obj);
        // obj.name = "李四";
        // obj.obj1.hobbby = "足球";
        // console.log(obj)
        function deepFreeze(obj){
            // 可以把obj里的东西全部冻结起来
            // 我们先冻结一层 ，然后遍历对象 如果 发现他的键值是对象的话 继续冻结一层的操作
            // 递归
            Object.freeze(obj);
            for(let i in obj){
                if(typeof obj[i] === 'object'){
                    // console.log(i);
                    deepFreeze(obj[i])
                }
            }
        }
        deepFreeze(obj);
        // deepFreeze(obj1)
        obj.obj1.obj2.name = "123";
        console.log(obj);



    </script>
</body>
</html>